<script lang="ts" setup>
  import Alert from '@sscd/alert';
</script>

<template>
  <div class="demo">
    <div class="demo-title">顶部公告</div>
    <div class="demo-content">
      <Alert message="Warning text" banner />
      <Alert
        class="mt12"
        message="Very long warning text warning text text text text text text text"
        banner
        closable
      />
      <Alert class="mt12" :show-icon="false" message="Warning text without icon" banner />
      <Alert class="mt12" type="error" message="Error text" banner />
    </div>
  </div>
</template>

<style lang="less" scoped>
  .mt12 {
    margin-top: 12px;
  }
</style>
